<template>
    <div>
        <div class="addform">
            <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                <el-form-item label="公交车编号" prop="name">
                    <el-input v-model="ruleForm.name" disabled></el-input>
                </el-form-item>
                <el-form-item label="车牌号" prop="region">
                    <el-select v-model="ruleForm.region" placeholder="请选择车牌号">
                        <el-option :label="item.id" :key="index" :value="item.id" v-for="(item,index) in this.chepaixuanz"></el-option>
                    </el-select>
                </el-form-item>
<!--                <el-form-item label="即时配送" prop="delivery">-->
<!--                    <el-switch v-model="ruleForm.delivery"></el-switch>-->
<!--                </el-form-item>-->
                <el-form-item label="现总路程数" prop="distanceNumber">
                    <el-input v-model="ruleForm.distanceNumber" placeholder="请填写数字"></el-input>
                </el-form-item>
<!--                <el-form-item label="活动性质" prop="type">-->
<!--                    <el-checkbox-group v-model="ruleForm.type">-->
<!--                        <el-checkbox label="美食/餐厅线上活动" name="type"></el-checkbox>-->
<!--                        <el-checkbox label="地推活动" name="type"></el-checkbox>-->
<!--                        <el-checkbox label="线下主题活动" name="type"></el-checkbox>-->
<!--                        <el-checkbox label="单纯品牌曝光" name="type"></el-checkbox>-->
<!--                    </el-checkbox-group>-->
<!--                </el-form-item>-->
                <el-form-item label="车轮选择" prop="lun">
                    <el-select v-model="ruleForm.regionlun" placeholder="请选择车轮">
                        <el-option label="无" value=""></el-option>
                        <el-option label="前轮" value="前轮"></el-option>
                        <el-option label="后轮" value="后轮"></el-option>
                    </el-select>
                    <el-input style="margin-left: 10px" v-model="ruleForm.lun" placeholder="输入具体情况,没有就填无"></el-input>
                </el-form-item>
                <el-form-item label="车窗选择" prop="chuang">
                    <el-select v-model="ruleForm.regionchuang" placeholder="请选择车窗">
                        <el-option label="无" value=""></el-option>
                        <el-option label="挡风窗" value="挡风窗"></el-option>
                        <el-option label="左部分窗" value="左部分窗"></el-option>
                        <el-option label="右部分窗" value="右部分窗"></el-option>
                    </el-select>
                    <el-input style="margin-left: 10px" v-model="ruleForm.chuang" placeholder="输入具体情况,没有就填无"></el-input>
                </el-form-item>
                <el-form-item label="座椅描述" prop="yizi">
                    <el-input v-model="ruleForm.yizi" placeholder="输入具体描述,没有就填无"></el-input>
                </el-form-item>
<!--                <el-form-item label="特殊资源" prop="resource">-->
<!--                    <el-radio-group v-model="ruleForm.resource">-->
<!--                        <el-radio label="线上品牌商赞助"></el-radio>-->
<!--                        <el-radio label="线下场地免费"></el-radio>-->
<!--                    </el-radio-group>-->
<!--                </el-form-item>-->
                <el-form-item label="当前油量" prop="youlian">
                    <el-input v-model="ruleForm.youlian" placeholder="输入油量信息"></el-input>
                </el-form-item>
                <el-form-item label="其他问题" prop="desc">
                    <el-input type="textarea" v-model="ruleForm.desc"></el-input>
                </el-form-item>
                <el-form-item label="急需处理" prop="desc">
                    <el-radio-group v-model="ruleForm.radio" style="margin-top: 10px">
                        <el-radio :label="1">是</el-radio>
                        <el-radio :label="2">否</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="submitForm('ruleForm')">立即上传</el-button>
                    <el-button @click="resetForm('ruleForm')">重置</el-button>
                </el-form-item>
            </el-form>
        </div>
        </div>
</template>

<script>
    export default {
        name: "StaffSec",
        data(){
            return{
                ruleForm: {
                    regionchuang:'',
                    regionlun:'',
                    name: '',
                    region: '',
                    date1: '',
                    date2: '',
                    delivery: false,
                    type: [],
                    resource: '',
                    desc: '',
                    distanceNumber:'',
                    chuang:'',
                    lun:'',
                    yizi:'',
                    youlian:'',
                    radio:0
                },
                rules: {
                    name: [
                        { required: true, message: '请输入活动名称', trigger: 'blur' }
                    ],
                    region: [
                        { required: true, message: '请选择活动区域', trigger: 'change' }
                    ],
                    date1: [
                        { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
                    ],
                    date2: [
                        { type: 'date', required: true, message: '请选择时间', trigger: 'change' }
                    ],
                    type: [
                        { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
                    ],
                    resource: [
                        { required: true, message: '请选择活动资源', trigger: 'change' }
                    ],
                    desc: [
                        { required: true, message: '请填写活动形式', trigger: 'blur' }
                    ],
                    distanceNumber:[
                        {required: true,message:'请填写路程数',trigger:'blur'}
                    ],
                    chuang:[
                        {required:true,message:'请填写车窗问题',trigger:'blur'}
                    ],
                    lun:[
                        {required:true,message:'请填写车轮问题',trigger:'blur'}
                    ],
                    yizi:[
                        {required:true,message:'请填写座椅问题',trigger:'blur'}
                    ],
                    youlian:[
                        {required:true,message:'输入油量信息',trigger:'blur'}
                    ]
                },
                chepaixuanz:[]
            }
        },
        methods:{
            submitForm(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        alert('submit!');
                        this.addBusSec();
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            resetForm(formName) {
                this.$refs[formName].resetFields();
                this.ruleForm.name=window.sessionStorage.getItem("busId");
            },
            getBusChepai(){
                this.ruleForm.name=window.sessionStorage.getItem("busId");
                let param={
                    id:0
                };
                param.id=window.sessionStorage.getItem("busId");
                this.$http({
                    url:'/busLicense/get',
                    method:'get',
                    params:param
                }).then(result=>{
                    console.log(result);
                    if(result.status==200){
                        this.chepaixuanz=result.data
                    }else {
                        this.$message({
                            type:'error',
                            message:'未知错误'
                        })
                    }

                })
            },
            addBusSec(){
                console.log(this.ruleForm);
                let shuzhu={
                    id: 0,
                    distanceNumber: 0,
                    lun: null,
                    chuang: null,
                    yizi: "",
                    sex: "",
                    youlian: "",
                    time: null,
                    chepai: ""
                };
                shuzhu.id=parseInt(this.ruleForm.name);
                shuzhu.distanceNumber=parseInt(this.ruleForm.distanceNumber);
                if(this.ruleForm.regionlun==""){
                    shuzhu.lun=null;
                }else {
                    shuzhu.lun=this.ruleForm.regionlun+"-"+this.ruleForm.lun;
                }
                if(this.ruleForm.regionchuang==""){
                    shuzhu.chuang=null;
                }else {
                    shuzhu.chuang=this.ruleForm.regionchuang+"-"+this.ruleForm.chuang;
                }
                shuzhu.yizi=this.ruleForm.yizi;
                shuzhu.sex=this.ruleForm.desc;
                shuzhu.youlian=this.ruleForm.youlian;
                shuzhu.chepai=this.ruleForm.region;
                console.log(shuzhu);

                this.$http({
                    url:'/busSec/add/'+this.ruleForm.radio,
                    method: 'post',
                    data:shuzhu
                }).then(result=>{
                    console.log(result);
                    if(result.status==200&&result.data>0){
                        this.$message({
                            type:'success',
                            message:'上传成功'
                        });
                        this.resetForm('ruleForm');
                        this.ruleForm.name=window.sessionStorage.getItem("busId");
                    }else {
                        this.$message({
                            type:'error',
                            message:'上传失败'
                        });
                    }
                })
            }
        },
        mounted() {
            this.getBusChepai();
        }
    }
</script>

<style scoped>
.addform{
    padding-top: 20px;
    padding-bottom: 20px;
    width: 50%;
    margin-left: 25%;
}
</style>
